<template>
  <div>
    <el-row>
      <el-col>
          <div style="margin: 0px 0px 10px 0px;">
              <img src="../../../assets/pep4a.jpg"/>
          </div>
          <div></div>
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="8">
        <el-card style="height: calc( 100vh - 100px);">
          <div slot="header" class="clearfix">
              <span>单元管理</span>
              <el-button style="float: right; padding: 3px 0" type="text" @click="handleCreaeUnit">新增单元</el-button>
            </div>
        </el-card>
      </el-col>
      <el-col :span="16">
        <el-card style="height: calc( 100vh - 100px);">
          <div slot="header" style="display: flex;">
              <div style="flex: 1;">
                <span>页面管理</span>
              </div>
              <div>
                  <el-button   type="primary" icon="el-icon-plus" >添加页面</el-button>
                  <el-button  type="primary" icon="el-icon-delete" >删除页面</el-button>
              </div>
            </div>
            <div>
              <el-table :data="pagelist" border>
                  <el-table-column label="序号" align="center" width="60px"></el-table-column>
                  <el-table-column label="页码" align="center" width="60px"></el-table-column>

              </el-table>
            </div>
        </el-card>
      </el-col>
    </el-row>

    <UnitCreateUI v-if="createUnitVisbile" ref="unitCreateUI"></UnitCreateUI>
  </div>
</template>

<script>
  import UnitCreateUI from './unit/create.vue';
  export default{
    components:{
      UnitCreateUI
    },
    data(){
      return{
        pagelist:[
          {}
        ],
        createUnitVisbile:false,
      }
    },
    methods:{
      handleCreaeUnit(){
          this.createUnitVisbile=true;
          this.$nextTick(()=>{
              this.$refs.unitCreateUI.dialogVisible=true;
          })
      }
    }
  }
</script>

<style>
</style>
